<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<html>
<head>
    <title>Book</title>
</head>
<body>
    <h3>上传</h3>
    <br/>
    <form action="${pageContext.request.contextPath}/upload" method="post" enctype="multipart/form-data">
        <input type="file" name="file"/>
        <input type="submit" value="上传"/>
    </form>
    <br/>
    <br/>
    <h3>批量上传</h3>
    <br/>
    <form action="${pageContext.request.contextPath}/uploadBatch" method="post" enctype="multipart/form-data">
        <input name="file" type="file" ><br />
        <input name="file2" type="file" ><br />
        <input name="file3" type="file" ><br />
        <input name="file4" type="file" ><br />
        <input type="submit" value="提交">
    </form>
    <br/>
    <br/>
    <h3>ajax上传文件</h3>
    <br/>
    <form id="myform">
        登录名<input id="loginName" type="text" name="loginName" />
        <br>
        上传录音<input type="file" name="record" />
        <input type="button" onclick="doUpload()" value="提交" />
    </form>
    <br/>
    <br/>
    <h2>书名列表</h2>
    <c:forEach items="${list}" var="book">
        ${book.name}<br/>
    </c:forEach>

    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.6.0.js"></script>
    <script>
        function doUpload() {
            var name = $("#loginName").val();
            console.info(name);
            var formData = new FormData($("#myform")[0]);
            $.ajax({
                url: '${pageContext.request.contextPath}/ajxUpload' ,
                type: 'POST',
                data: formData,
                async: false,
                cache: false,
                contentType: false,
                processData: false,
                success: function (returndata) {
                    alert(returndata);
                },
                error: function (returndata) {
                    alert(returndata);
                }
            });
        }

    </script>
</body>
</html>
